<template>
  <div>
    <div>
      <!--  根据条件查询-->
      <div>
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
          <el-form-item label="选择一级种类名称:">
            <el-select v-model="pid,value" placeholder="选择一级种类" @change="changeLevel2(value)">
              <el-option value='' label="请选择"></el-option>
              <el-option @click.native="getPid(item.pid)"
                         v-for="item in fileKind"
                         :key="item.id"
                         :label="item.kindName"
                         :value="item.id">
              </el-option>
            </el-select>

          </el-form-item>
          <el-form-item label="选择二级种类名称:" v-if="fileKind2!=null&&fileKind2!=''">
            <el-select v-model="value2" placeholder="选择二级种类" @change="changeLevel3(value2)">
              <el-option value='' label="请选择"></el-option>
              <el-option
                  v-for="item in fileKind2"
                  :key="item.id"
                  :label="item.kindName"
                  :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="选择三级种类名称:" v-if="fileKind3!=null&&fileKind3!=''">
            <el-select v-model="value3" placeholder="选择三级种类">
              <el-option value='' label="请选择"></el-option>
              <el-option
                  v-for="item in fileKind3"
                  :key="item.id"
                  :label="item.kindName"
                  :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item>
            <el-button type="primary" @click="init">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <!--编号,名称,档次级别,1级分类,二级分类,三级分类,用途类型,产品经理  -->
      <div>
        <el-table
            :data="fileData"
            border
            style="width: 100%">
          <el-table-column
              fixed
              prop="productId"
              label="产品名"
              width="150">
          </el-table-column>
          <el-table-column
              prop="productName"
              label="产品编号 "
              width="120">
          </el-table-column>
          <el-table-column
              prop="procedureDescribe"
              label="设计要求"
              width="120">
          </el-table-column>
          <el-table-column
              prop="costPriceSum"
              label="工时总成本"
              width="120">
          </el-table-column>
          <el-table-column
              label="操作"
              width="180">
            <template slot-scope="scope">
              <el-button @click="handleClick(scope.row,'S001-1','确认通过审核吗')" type="text" size="medium">通过</el-button>
              <el-button @click="handleClick(scope.row,'S001-2','确认要拒绝审核吗')" type="text" size="medium">不通过</el-button>

            </template>
          </el-table-column>
        </el-table>
      </div>
      <!--分页    -->
      <div class="block">
        <el-pagination
            @size-change="handleSizeChange"
            :current-page="Number(pageNum)"
            :page-sizes="[2, 4, 8, 16]"
            :page-size="Number(pageSize)"
            @current-change="handleCurrentChange"
            layout="total, sizes, prev, pager, next, jumper"
            :total="Number(total)">
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
import axios from "axios";
import request from "../../../request.js"

export default {
  name: "FileProductionCheck",
  data() {
    return {
      formInline: {
        user: '',
        region: ''
      },
      pid: '',
      value: '',
      value2: '',
      value3: '',
      fileKind: [],
      fileKind2: [],
      fileKind3: [],
      //查询数据
      pageNum: '',
      pageSize: '',
      name: '',
      total: '',
      //初始化展示数据
      fileData: [],
    }
  }, methods: {
    handleClick(row, h, message) {
      this.$confirm(message, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        axios.post("http://localhost:8150/design-procedure/checkProcedure", {
          'id': row.id,
          'checkTag': h,
          'productId': row.productId,

        }).then(data => {
          if (data.data.flag==false) {
            this.$message({
              showClose: true,
              message: data.data.message,
              type: data.data.flag == true ? "success" : "error"
            })
            return;
          }
          if (data.data.flag) {
            this.init();
            this.getSelectValue();
          }
          this.$message({
            showClose: true,
            message: data.data.message,
            type: data.data.flag == true ? 'success' : 'error'
          });
        }).catch(e => {
          alert("错误信息为:" + e)
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消审核'
        });
      });

    },
    //初始化数据
    init() {
      axios.get("http://localhost:8150/design-procedure/queryProcedure", {
        params: {
          'firstId': this.value,
          'secondId': this.value2,
          'threeId': this.value3,
          'pageNum': this.pageNum,
          'pageSize': this.pageSize,
          'checkTag': 'S001-0'
        }
      }).then(data => {
        if (data.data.flag==false) {
          this.$message({
            showClose: true,
            message: data.data.message,
            type: data.data.flag == true ? "success" : "error"
          })
          return;
        }
        this.fileData = data.data.data.records;
        this.pageNum = data.data.data.current;
        this.pageSize = data.data.data.size;
        this.total = data.data.data.total;
      }).catch(e => {
        alert("错误信息为:" + e)
      })
    },
    handleSizeChange(val) {
      this.pageSize = val;
      //  console.log(`每页 ${val} 条`);
      this.init();
    },
    handleCurrentChange(val) {
      this.pageNum = val;
      //console.log(`当前页: ${val}`);
      this.init();
    },
    changeLevel2(id) {
      // console.log("value:" + id)
      let a = 0;
      for (let i = 0; i < this.fileKind.length; i++) {
        for (let j = 0; j < this.fileKind[i].list.length; j++) {
          if (id === this.fileKind[i].list[j].pid) {
            this.fileKind2[a] = this.fileKind[i].list[j];
            a++;
          } else {
            this.fileKind2 = [];
            this.fileKind3 = [];
            this.value2 = '';
            this.value3 = '';
          }
        }

      }
    }, getPid(id) {
      this.pid = id;
    },//获取下拉框的值
    getSelectValue() {
      axios.get("http://localhost:8150/config-file-kind/displayType").then(data => {
        this.fileKind = data.data.data;
        this.fileKind11 = data.data.data;
      }).catch(e => {
        alert("错误信息为:" + e)
      });
    },
    changeLevel3(id) {
      //  console.log(id)
      let a = 0;
      for (let i = 0; i < this.fileKind2.length; i++) {
        for (let j = 0; j < this.fileKind2[i].list.length; j++) {
          if (id == this.fileKind2[i].list[j].pid) {
            // console.log(this.fileKind2[i].list[j].pid)
            this.fileKind3[a] = this.fileKind2[i].list[j];
            a++;
          } else {
            this.fileKind3 = [];
            this.value3 = '';
          }
        }
      }
    }
  }, created() {
    this.getSelectValue();
    this.init();
  }
}
</script>

<style scoped>

</style>